import React from 'react';
import {increamentAction,increamentActionAsync} from './store/action/actionCounter'
import {actionUserAsync} from './store/action/actionUser'
import {connect} from 'react-redux';

function App(props){
  // const {count,actionIncrement} = props
  const {count,increamentAction,increamentActionAsync,actionUserAsync,name,error} = props
  return (
    <div>
      <p>count:{count}</p>
      <button onClick={increamentAction}>Sync+</button>
      <button onClick={increamentActionAsync}>Async+</button>
      {
        error?<p>errror:{error}</p> :<p>name:{name}</p>
      }
      <button onClick={actionUserAsync}>getUser</button>
    </div>
  )
}

const mapState = state=>({
  count:state.reducerCounter.count,
  name:state.reducerUser.user.name,
  error:state.reducerUser.error,
})
const mapDispatch = {increamentAction,increamentActionAsync,actionUserAsync}


export default connect(mapState,mapDispatch)(App) 